<template>
  <div style="text-align:'center';height:100%">
    <img alt="preview" :style="styleObject" :src="imageUrl" />
  </div>
</template>

<script>
  import CodeMirror from 'codemirror'

  const previewPic = 'https://dn-coding-net-production-static.qbox.me/static/5d487aa5c207cf1ca5a36524acb953f1.gif'

  export default {
    props: ['path'],
    data: function () {
      return {
        imageUrl: ''
      }
    },
    computed: {
      styleObject: function () {
        return {
          background: `url("${previewPic}") right bottom #eee`,
          testAlign: 'center',
          height: '100%'
        }
      }
    },
    methods: {
      getImageUrl: function () {
        // const { baseURL, spaceKey } = config
        // const backgroundImageUrl = `${baseURL}/workspaces/${spaceKey}/raw?path=${encodeURIComponent(this.props.path)}`
        // request.get(backgroundImageUrl, {}, {
        //   responseType: 'blob'
        // }).then(blob => {
        //   this.imageUrl = window.URL.createObjectURL(blob)
        // })
      }
    },
    mounted() {
      this.getImageUrl()
    }
  }

</script>
